import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:series_play/comm/base/base_state.dart';
import 'package:series_play/comm/ext/num_ext.dart';
import 'package:series_play/generated/assets.dart';
import 'package:series_play/widget/app_tab.dart';
import 'package:series_play/widget/app_color.dart';
import 'package:series_play/widget/app_image.dart';
import 'package:series_play/widget/app_refresh_view.dart';
import 'package:series_play/widget/app_text.dart';

import '../../widget/series_tag.dart';
import 'controller/home_rank_controller.dart';

/// 首页排行列表
class HomeRankPage extends StatefulWidget {
  const HomeRankPage({super.key});

  @override
  State<HomeRankPage> createState() => _HomeRankPageState();
}

class _HomeRankPageState
    extends BaseControllerState<HomeRankPage, HomeRankController>
    with TickerProviderStateMixin {
  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(
      length: mController.filters.length,
      vsync: this,
    );
    mController.onRefresh();
  }

  @override
  Widget buildPage(BuildContext context) {
    final list = AppRefreshListView(
      listController: mController,
      itemBuilder: (context, index) {
        return Container(
          padding: const EdgeInsets.symmetric(horizontal: 18).w,
          height: 100.w,
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                width: 76.w,
                height: 100.w,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(8).r,
                  image: DecorationImage(
                    image: NetworkImage(mController.dataList[index]),
                    fit: BoxFit.cover,
                  ),
                ),
                child: Stack(
                  children: [
                    Positioned(
                      top: 2.w,
                      left: 2.w,
                      child: Container(
                        width: 14.w,
                        height: 16.w,
                        decoration: BoxDecoration(
                          image: DecorationImage(
                            image: AssetImage(index.getRankBadge()),
                            fit: BoxFit.fill,
                          ),
                        ),
                        alignment: Alignment.center,
                        child: AppText(
                          '${index + 1}',
                          color: AppColor.white,
                          fontSize: 11,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.all(10).w,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      AppText(
                        '悬崖下的某某某等待结缘的一天',
                        maxLines: 2,
                        overflow: TextOverflow.ellipsis,
                        color: AppColor.white,
                      ),
                      const Spacer(),
                      /// 这里要动态设置标签
                      SeriesTag('诸多人在追'),
                    ],
                  ),
                ),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 12).w,
                child: Row(
                  children: [
                    AppImage(Assets.imagesIcHotFire, size: 12),
                    6.horizontalSpace,
                    AppText.secondary('888.8K', color: AppColor.white),
                  ],
                ),
              ),
            ],
          ),
        );
      },
      separatorBuilder: (context, index) {
        return 12.verticalSpace;
      },
      itemCount: mController.dataList.length,
      onRefresh: mController.onRefreshing,
      onLoad: mController.onLoadingMore,
    );
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        AppTab.rank(mController.filters, _tabController),
        10.verticalSpace,
        Expanded(child: list),
      ],
    );
  }

  @override
  HomeRankController createController() {
    return HomeRankController();
  }

  @override
  bool hideAppbar() {
    return true;
  }

  @override
  bool get wantKeepAlive => true;

  @override
  Color getBackgroundColor() {
    return Colors.transparent;
  }

  @override
  void dispose() {
    super.dispose();
    _tabController.dispose();
  }
}
